<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <title>twocode</title>
    <!-- 避免IE使用兼容模式 -->
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
 	<link th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
 	<link th:href="@{/css/layer.css}" rel="stylesheet"/>
</head>
<body class="fixed-sidebar full-height-layout gray-bg" style="">
<div class="" id="wrapper">
 	<div class="main-content">
        <form id="form-info" class="form-horizontal">
            <input name="deptId" type="hidden" id="treeId"/>
            <h4 class="form-header h4">基本信息</h4>
            <hr>
            <div class="row">
            	<div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">名称：</label>
                        <div class="col-sm-8">
                            <input name="codeName" placeholder="名称" value="名称" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">保存路径：</label>
                        <div class="col-sm-8">
                            <input id="codeCreateUrl" name="codeCreateUrl" value="D:/yule" placeholder="二维码容生成地址(D:/yule)" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">尺寸：</label>
                        <div class="col-sm-8">
                            <div class="input-group">
                                <input id="codeSize" name="codeSize" placeholder="二维码尺寸" value="222" class="form-control" type="text" maxlength="11" required>
                                <span class="input-group-addon"><i class="fa fa-mobile"></i></span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">边距：</label>
                        <div class="col-sm-8">
                            <div class="input-group">
                                <input id="codePadding" name="codePadding" value="2" class="form-control" type="text" maxlength="50" placeholder="二维码边距" required>
                                <span class="input-group-addon"><i class="fa fa-envelope"></i></span>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">容错率：</label>
                        <div class="col-sm-8">
                            <input id="codeErr" name="codeErr" value="L" placeholder="容错率(L(7%),M(15%),Q(25%),H(30%))" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">图片类型：</label>
                        <div class="col-sm-8">
                            <input id="picType" name="picType" value="png" placeholder="二维码图片类型(png/jpg)" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-xs-2 control-label">内容：</label>
                        <div class="col-xs-10">
                            <textarea name="codeContent" maxlength="500" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <h4 class="form-header h4">二维码logo信息</h4>
            <hr>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label">是否打印logo：</label>
                    <div class="col-sm-8">
                        <label class="toggle-switch switch-solid">
                            <input type="checkbox" id="logoFlag">
                            <span></span>
                        </label>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">logo地址：</label>
                        <div class="col-sm-8">
                            <input id="logoUrl" name="logoUrl" placeholder="logo地址" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
            </div>
            <h4 class="form-header h4">二维码配字信息</h4>
            <hr>
            <div class="col-sm-6">
                <div class="form-group">
                    <label class="col-sm-4 control-label">是否配字符：</label>
                    <div class="col-sm-8">
                        <label class="toggle-switch switch-solid">
                            <input type="checkbox" id="codeFontFlag">
                            <span></span>
                        </label>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">配字符：</label>
                        <div class="col-sm-8">
                            <input id="codeFontContent" name="codeFontContent" value="二维码下面的字符" placeholder="显示在二维码下面的字符" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="form-group">
                        <label class="col-sm-4 control-label is-required">字符大小：</label>
                        <div class="col-sm-8">
                            <input id="fontSize" name="fontSize" placeholder="字符大小" value="22" class="form-control" type="text" maxlength="30" required>
                        </div>
                    </div>
                </div>
            </div>
            <h4 class="form-header h4">其他信息</h4><hr>
            <div class="row">
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-xs-2 control-label">备注：</label>
                        <div class="col-xs-10">
                            <textarea name="remark" maxlength="500" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-12">
                    <div class="form-group">
                        <label class="col-xs-2 control-label">二维码预览：</label>
                        <div class="col-xs-10">
                        	<img id="twocode"></img>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
      
    <div class="row">
        <div class="col-sm-offset-5 col-sm-10">
        <button type="button" class="btn btn-sm btn-primary" onclick="view()"><i class="fa fa-check"></i>预 览</button>&nbsp;
            <button type="button" class="btn btn-sm btn-primary" onclick="submitHandler()"><i class="fa fa-check"></i>保 存</button>&nbsp;
            <button type="button" class="btn btn-sm btn-danger" onclick="clean()"><i class="fa fa-reply-all"></i>清 除</button>
        </div>
    </div>
</div>
<script th:src="@{/js/jquery.min.js}"></script>
<script th:src="@{/js/bootstrap.min.js}"></script>
<script th:src="@{/js/layer.min.js}"></script>
<script th:src="@{/js/yule.js?v=4.4.0}"></script>
<script th:inline="javascript">
	function submitHandler() {
        	var data = $("#form-info").serializeArray();
        	var logoFlag = $("input[id='logoFlag']").is(':checked');
        	data.push({"name": "logoFlag", "value": logoFlag});
        	var codeFontFlag = $("input[id='codeFontFlag']").is(':checked');
        	data.push({"name": "codeFontFlag", "value": codeFontFlag});
        	$.operate.saveTab("/toCode", data);
	    }
	function view() {
        	var data = $("#form-info").serializeArray();
        	var logoFlag = $("input[id='logoFlag']").is(':checked');
        	data.push({"name": "logoFlag", "value": logoFlag});
        	var codeFontFlag = $("input[id='codeFontFlag']").is(':checked');
        	data.push({"name": "codeFontFlag", "value": codeFontFlag});
        	
        	var config = {
        	        url: "/toCodeBuf",
        	        type: "POST",
        	        dataType: "json",
        	        data: data,
        	        beforeSend: function () {
        	        },
        	        success: function(result) {
						layer.msg(result.msg);
        	        	$('#twocode').attr('src', result.data);
        	        }
        	    };
        	$.ajax(config)
        	
	    }
	function clean() {
        	$('#twocode').attr('src', '');
	    }
	    
</script>
</body>
</html>
